import React from 'react';
import SplitPane from '../components/SplitPanel';
import ToolHead from './components/ToolHead';
import ProjectArea from './ProjectArea';
import ZcbfArea from './ZcbfArea';
import './index.less';

const ProjectManager = () => {
  return (
    <>
      <div style={{ height: 'calc(100vh - 8px)', display: 'flex', flexDirection: 'column', padding: '0px 16px' }}
        className='verticalProject'>
        <ToolHead />
        <SplitPane
          split="vertical"
          minSize={400}
          size='50%'
          maxSize={850}
          allowResize={true}
          style={{ backgroundColor: 'white', border: 1, flexGrow: 1, overflow: 'hidden' }}
        >
          <ProjectArea />
          <ZcbfArea />
        </SplitPane>

      </div>
    </>
  );
};

export default ProjectManager;
